你为什么需要 husky

你为什么需要 husky

husky（哈士奇）一种精力和破坏力都极强的生物，混乱制造者。有一位伟大的法师说过，要用魔法来打败魔法，你需要这个 husky，帮助你避免一个不留神家被拆了。

还有一个原因是，能用工具解决的问题都使用工具解决，而非额外的人力。

如果你想要找一个项目作为参考，可以查看我的 鲜果起始页 项目

前提准备

一个 js 项目 配置好 eslint 安装好 git

添加依赖

安装 husky，husky 本身只提供了执行 git 对应命令时，调取对应的钩子函数，因此需要其它工具来执行对应的检查

npm i husky -D

commitlint 用于对提交内容（commit message）进行检查

npm i @commitlint/cli @commitlint/config-conventional -D

lint-staged 用于在缓冲区执行 lint，代码检查

npm i lint-staged -D

cz-git 自定义 git 提交工具

npm i cz-git czg -D

更新你的 package.json

{
  "scripts": {
    "lint-staged": "lint-staged", // 该命令用于在缓冲区执行
    "commit": "czg", // 之后可以使用 npm rum commit 代替 git commit -m ''
    "prepare": "husky init" // 拉去依赖后，自动执行该命令
  },
  "config": {
    "commitizen": { // 定义 commitlint 的配置
      "path": "node_modules/cz-git"
    }
  },
  "lint-staged": {
    "*.{js,jsx,ts,tsx}": [ // 对以 js,jsx,ts,tsx 后缀名的文件使用 eslint --fix
      "eslint --fix"
    ],
    "*.{md,json}": [ // 对以 md,json 后缀名的文件使用 prettier --write
      "prettier --write"
    ]
  }
}

创建 husky 文件

husky 会在 package.json 目录创建 .husky 文件，如果没有创建，可以手动创建

手动创建 .husky\commit-msg 文件，并且添加以下内容

#!/bin/sh
# . "$(dirname "$0")/_/husky.sh"

npx --no -- commitlint --edit $1

手动创建 .husky\pre-commit 文件，并且添加以下内容

#!/bin/sh
# . "$(dirname "$0")/_/husky.sh"

npm run lint-staged

echo '✅✅✅ lint pass ✅✅✅'

你可以在这些 bash 文件中自定义命令，来实现你相对应的需求

完成

到了这里，你已经完成了在项目中添加 husky 的所有步骤，并且添加提交检查以及 git 缓冲区的检查功能

之后你可以使用 npm run commit 提交变更